<template>
	<view class="">
		
	
	<view class="cont">
		
	</view>
	<view class="margin bg-fff ">
		<view class="text-center">
			<image class="avatar" src="../../static/logo.png" mode=""></image>
		</view>
		<view class="fs-28 text-center">
			张三丰
		</view>
		<view class="flex grid">
			<!-- 改变位置样式 -->
			<view v-for="(item,index) in gridArr" class="flex flex-direction align-center padding" >
				<text :class="['iconfont margin-bottom-xs',item.icon]"></text>
				{{item.name}}
				<!-- <u-tag text="标签" plain size="mini" type="warning"></u-tag> -->
				<!-- <u-rate :count="count" v-model="value"></u-rate> -->
			</view>
			
		</view>
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				gridArr:[
					{
						icon:'icon-wodedingdan',
						name:'我的订单'
					},
					{
						icon:'icon-daishouhuo',
						name:'待收货'
					},
					{
						icon:'icon-31daifukuan',
						name:'待付款'
					},
					{
						icon:'icon-huiyuandengji',
						name:'会员等级'
					}
				],
				count: 4,
				value: 1
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.cont{
	background-color: #f6f6f6;
	height:400upx ;
}
.grid .iconfont{
	font-size: 50upx;
	color: #888;
}
.avatar{
	width: 150upx;
	height: 150upx;
	border-radius: 50%;
	// transform: translateY(-50%);
	margin-top: -75upx;
}
.margin.bg-fff{
	margin-top: -200upx;
}
</style>
